<template>
    <div>
        <div style="background-color:#0c93c7; width: 100%; height: 100px;">

        </div>
        <el-row type="flex" justify="center">
            <el-col :span="3" type="flex" justify="center">
                <el-menu :default-active="this.$route.path" class="el-menu-vertical-demo" router>
                    <h5 style="font-size: 30px;text-align: center;margin:20px 0 30px 0px;color:#303133;">个人中心</h5>
                    <el-menu-item v-for="(i, index) in menuList" :index="i.path" :key="index">
                        <i :class="i.icon"></i>
                        <span slot="title">{{ i.title }}</span>
                    </el-menu-item>
                </el-menu>
            </el-col>
            <el-col style="margin-left: 20px;margin-top: 30px;" :span="10">
                <router-view />
            </el-col>

        </el-row>

    </div>


</template>
<style scoped>

</style>
<script>
import router from '@/router';


export default {
    name: "My",
    data() {
        return {
            tabPosition: 'top',
            active: 1,
            userId: JSON.parse(localStorage.getItem("user")).id,
            //二级菜单:
            menuList: [
                { title: "个人资料", icon: "el-icon-menu", path: "/person-profile" },
                { title: "我的收藏", icon: "el-icon-star-off", path: "/my-favorites" },
                { title: "我的关注", icon: "el-icon-s-custom", path: "/my-concerns" },
            ]
        };
    },
    components: { router }
}

</script>


